<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
#div1 input{background-color:white;}
#div1 input.active{background-color: yellow;}
#div1 div{width:200px;height:200px;background-color: #ccc;display: none;}
    </style>
    <script>
        window.onload=function(){
            var oDiv=document.getElementById('div1');
            var aBtn=oDiv.getElementsByTagName('input');
            var aDiv=oDiv.getElementsByTagName('div');
            for(var i=0;i<aBtn.length;i++){
                aBtn[i].index=i;
                aBtn[i].onclick=function(){
                    for(var i=0;i<aBtn.length;i++){
                        aBtn[i].className='';
                        aDiv[i].style.display='none';
                    }
                    this.className='active';
                    aDiv[this.index].style.display='block';
                } ;
            }
        };

    </script>
</head>
<body>
<div id="div1">
    <input class="active" type="button" value="aaa">
    <input type="button" value="bbb">
    <input type="button" value="ccc">
    <div style="display: block;">aaa</div>
    <div>bbb</div>
    <div>ccc</div>
</div>
</body>
</html>